<template>
  <view>
    <view class="home">
      <view class="top_menus">
        <view class="top_menus_item" v-for="item in topMenu" :key="item.value" @tap="goto(item.value)">
          <view class="top_menus_img">
            <image :src="item.imgUrl" style="width:100%;height:100%"></image>
          </view>
          <text>{{item.name}}</text>
        </view>
      </view>
      <view class="my_menus">
        <view class="my_menus_title">我的业务</view>
        <view class="my_menus_item" v-for="(item,index) in myMenuList" :key="index" @tap="goto(item.url)">
          <image :src="item.imgUrl" class="my_menus_img"></image>
          <view>{{item.name}}</view>
        </view>
      </view>
      <view class="count_data">
        <view class="my_menus_title">
          <view class="title_text">油站数据
            <AtActivityIndicator style="display:inline-block" color="#333" :isOpened="showLoading"></AtActivityIndicator>
          </view>
          <!-- <view class="title_tabs"
            v-for="(item,index) in timeOptions"
            :key="index" 
            :class="{title_tabs_slt: item.selected}"
            @tap="changeTimeOptions(index)">{{item.name}}</view> -->
        </view>
        <view class="count_box">
          <view class="count_item">
            <view class="count_item_value">{{orderData.total_money}}</view>
            应收金额
          </view>
          <view class="count_item">
            <view class="count_item_value">{{(Number(orderData.total_money) - Number(orderData.total_amount)).toFixed(2)}}</view>
            优惠金额
          </view>
          <view class="count_item">
            <view class="count_item_value">{{orderData.total_amount}}</view>
            实收金额
          </view>
        </view>
      </view>
      <view class="payment_box">
        <!-- <view class="oils_line" v-for="(item,index) in baseData.goods" :key="index" :class="{oils_line_top: index!=0}">
          <view class="oils_title">
            <view class="oils_top_line">{{item.type}}</view>
            <view class="oils_bottom_line">订单数:{{item.count}}</view>
          </view>
          <view class="oils_num">
            <view class="oils_top_line">{{item.num}}</view>
            <view class="oils_bottom_line">升数</view>
          </view>
          <view class="oils_num">
            <view class="oils_top_line">{{item.money}}</view>
            <view class="oils_bottom_line">实收金额</view>
          </view>
        </view> -->
        <view class="payment_list">
          <view class="payment_item" :class="{payment_part_line:item.rline}" v-for="(item,index) in paymentList" :key="index">
            <view class="payment_value">{{item.value}}</view>
            <view class="payment_name" :class="{payment_bottom_line: index<=2}">{{item.name}}</view>
          </view>
        </view>
      </view>
    </view>
    <AtModal
      :isOpened="showDialog"
      title='提示'
      cancelText='取消'
      confirmText='确认'
      :onCancel="handleCancel"
      :onConfirm="handleConfirm"
      content='登陆信息已过期，请重新登陆，是否前往登陆？'
    />
    <AtToast :isOpened="showToast" text="else token" ></AtToast>
  </view>
</template>

<script>
import './home.scss'
import Taro from '@tarojs/taro'
import OrderAPI from '../../api/order.js'
import { formatTime } from "../../utils/timeFormat"
export default {
  name: 'home',
  data(){
    return{
      orderData: {
        total_amount: 0.00,
        total_money: 0.00
      },
      showDialog: false,
      topMenu: [
        {name: "快速开单", value: "/pages/quickBill/quickBill", imgUrl: "https://zltc-1255680458.cos.ap-beijing.myqcloud.com/1602748006.png"},
        {name: "扫码核销", value: "scan", imgUrl:"https://zltc-1255680458.cos.ap-beijing.myqcloud.com/1602748031.png"},
        {name: "快速收款", value: "/pages/getMoney/selectClient", imgUrl:"https://zltc-1255680458.cos.ap-beijing.myqcloud.com/1602748046.png"},
        {name: "快速充值", value: "/pages/recharge/choseUserWx", imgUrl:"https://zltc-1255680458.cos.ap-beijing.myqcloud.com/1602748061.png"},
      ],
      timeOptions: [
        {name: "今天", selected: true, timeValue: [formatTime(new Date(),"day_start"),formatTime(new Date(),"day_end")]},
        {name: "昨天", selected: false, timeValue: [],},
        {name: "全部", selected: false, timeValue: ["",""]},
      ],
      myMenuList: [
        // {imgUrl: "https://zltc-1255680458.cos.ap-beijing.myqcloud.com/1609390289.png", name: "会员列表", url: "/pages/menuList/userList/userList"},
        {imgUrl: "https://zltc-1255680458.cos.ap-beijing.myqcloud.com/1609390249.png", name: "门店", url: "/pages/shop/index"},
        {imgUrl: "https://zltc-1255680458.cos.ap-beijing.myqcloud.com/1609392334.png", name: "业务", url: "/pages/business/business"},
        {imgUrl: "https://zltc-1255680458.cos.ap-beijing.myqcloud.com/1609390268.png", name: "会员资产", url: "/pages/userMenu/search"},
        {imgUrl: "https://zltc-1255680458.cos.ap-beijing.myqcloud.com/1609400051.png", name: "全部", url: ""},
        // {imgUrl: "https://zltc-1255680458.cos.ap-beijing.myqcloud.com/1602569225.png", name: "交班", url: "/pages/shiftExchange/index"},
        // {imgUrl: "https://zltc-1255680458.cos.ap-beijing.myqcloud.com/1609392434.png", name: "充值确认", url: "userList"},
        // {imgUrl: "https://zltc-1255680458.cos.ap-beijing.myqcloud.com/1602569225.png", name: "功能", url: "userList"},
        // {imgUrl: "https://zltc-1255680458.cos.ap-beijing.myqcloud.com/1602569225.png", name: "功能", url: "userList"},
        // {imgUrl: "https://zltc-1255680458.cos.ap-beijing.myqcloud.com/1602569225.png", name: "功能", url: "userList"},
        // {imgUrl: "https://zltc-1255680458.cos.ap-beijing.myqcloud.com/1602569225.png", name: "功能", url: "userList"},
      ],
      paymentList: [
        {name: "银联支付", payment_code: "unionpay",value: "0.00", rline: true},
        {name: "现金支付", payment_code: "cash",value: "0.00", rline: true},
        {name: "余额支付", payment_code: "balance",value: "0.00", rline: false},
        {name: "加油卡", payment_code: "card_balance",value: "0.00", rline: true},
        {name: "家庭卡", payment_code: "family_balance",value: "0.00", rline: true},
        {name: "车队卡", payment_code: "team_balance",value: "0.00", rline: false},
      ],
      showLoading: false, // 统计数据加载
      baseData: {},
      showToast: false,
    }
  },
  mounted(){
    this.init();
    this.getOrderData();
    this.getBaseData();
  },
  methods: {
    init(){
      if(!Taro.getStorageSync('token')){
        this.showDialog = true;
      }else{
        // this.showToast = true;
      }
      var start = new Date();
      start.setTime(start.getTime() - 3600 * 1000 * 24);
      this.timeOptions[1].timeValue = [formatTime(start,"day_start"),formatTime(start,"day_end")]
      // console.log('timeOptions: ============',this.timeOptions[0].timeValue);
    },
    async getOrderData(){
      var paramTime = this.timeOptions.find(x => x.selected).timeValue;
      var data = {
        page: 1,
        pay_status: "2",
        emp_id: Taro.getStorageSync('emp_id')
      }
      // data.emp_id = Taro.getStorageSync('emp_id') // 当前员工的数据
      const res = await OrderAPI.OlisOrderNow(data);
      console.log(res)
      if(res.code == 200 || res.code == 400){
        this.orderData = res.count;
        this.paymentList.forEach(item => {
          item.value = res.count.pay_type.find(x => x.payment_code == item.payment_code).total_amount;
        })
      }else{
        console.log('should open showDialog')
        this.showDialog = true
      }
      setTimeout(() => {
        this.showLoading = false;
      }, 500);
    },
    async getBaseData() {
      var data = {
        app_id: Taro.getStorageSync('app_id'),
        daynum: 1
      }
      const res = await OrderAPI.baseData(data);
      if(res.code == 200) {
        this.baseData = res.data;
      }
    },
    handleConfirm(){
      this.showDialog = false;
      Taro.navigateTo({
        url: '/pages/login/login'
      })
    },
    handleCancel(){
      this.showDialog = false
    },
    goto(url){
      if(url == 'scan'){
        Taro.scanCode({
          success: (res) => {
            console.log(res)
            Taro.navigateTo({
              url: "/pages/scanResult/result"
            })
          }
        })
      }else{
        Taro.navigateTo({
          url: url
        })
      }
    },
    changeTimeOptions(i){
      this.showLoading = true;
      this.timeOptions.forEach(item => {
        item.selected = false;
      })
      this.timeOptions[i].selected = true;
      this.getOrderData();
      this.getBaseData();
    }
  },
  
}
</script>
